<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>订单详情</title>
    <link rel="icon" href="../favicon.ico" type="image/x-icon" />
    <link rel="shortcut icon" href="../favicon.ico" type="image/x-icon" />
    <!--<script src="../js/dist/seajs/2.3.0/dist/sea.js"></script>-->
    <link rel="stylesheet" href="../css/wzl-bootstrap.css?q=1111"/>
    <script>

//      seajs.config({
//          base:'../js/dist'
//      })
//      seajs.use('wzlh5/1.0.0/account',function(account){
//          account.account('bettingRecord');
//      })
    </script>
    <!-- 行内样式属于该页面独有样式 -->
    <style>

        h3.wzl-h-red{
            margin-top:0px;
        }

        .wzl-hafix{
            padding-bottom:60px !important;
        }
        
        .wzl-pl-10{padding-left: 10px;}
        .order-table{margin: 0px;}

        .table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td{ vertical-align: middle; }
        .table>thead>tr>th,.table>tbody>tr>td{border-right: 1px solid #ddd; text-align: center;}
        .table>thead>tr>th{border-bottom: none;}
        .table>thead>tr>th.border-right-none, .table>tbody>tr>td.border-right-none{border-right: none;}

        
        .lottory-detailrecord-list{
            background: #E9E9E9;
        }
        
        .lottory-detailrecord-list .icon-dropdown-trans:after{
            top: 10px;
        }
        .lottory-detailrecord-bet{
            font-size: 12px;
            text-align: left;
        }
		.lottory-detailrecord-list span{
			display:block;
			text-align:center;
			color:#0066EE;
		}
		.winData span{
			display:block;
		}
		.active{
			color:red;
		}
    </style>
</head>
<body>

<div id="warp">
    <div class="top-buff-bar"></div>
    <nav class="wzl-navbar navbar-default" role="navigation">
        <div class="container-fluid">
            <div class="navbar-header">
                <div class="wzl-nav-bar" onclick="history.back(-1)">
                    <span class="glyphicon glyphicon-wzl-back"></span>
                        <span class="wzl-nav-dropdown">
                            	订单详情
                        </span>
                </div>
                <!-- <div class="wzl-nav-share ">
                    <span class=" glyphicon icon-share"></span>
                </div> -->
            </div>
        </div>
    </nav>          
</div>

<div id="zh-template" >
   <!--<h3 class=" text-center wzl-mb-20 wzl-h-red">{{data.lotoid}} 第{{data.issue}}期</h3>-->
    <div class="order row ">
        <div class="order-desc-list">
        	<div class="container header-container">
	            
            </div>
            <div class="items container">
                <div class="items-subtitle">选号方案:</div>
                <div class="order-table">
                    <table class="table table-orderrecord">
                        <thead>
                         <tr class="daLeTou hidden">
                            <th>序号</th>
                            <th>投注号码</th>
                            <th>玩法</th>
                            <th>倍数</th>
                        </tr>	
                        <tr class="jinCai hidden">
                            <th>场次</th>
                            <th>主队vs客队</th>
                            <th>投注(出票赔率)</th>
                            <th>彩果</th>
                        </tr>
                        </thead>
                        <tbody class="tbody-container">
                                           
                                                       
                        </tbody>
                    </table>
                </div>
            </div>                
        </div>
    </div>   
</div>  
<!--主胜${re.data.bet_codes[i].bet_odds[i]}-->
    <script src="../js/jquery-1.8.0.min.js"></script>
    <script >
        // var BACKEND_URL="http://47.98.180.88:1688";

        var BACKEND_URL="http://116.62.67.14:8088";




      	var url =window.location.search; //获取url中"?"符后的字串 
		var theRequest = new Object();
		 var orderNumber;
		 var orderStyle;
		if (url.indexOf("?") != -1) { 
		       var str = url.substr(1); 
		         strs = str.split("&"); 
				for(var i = 0; i < strs.length; i ++) { 
					theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]); 
				}  
				 orderNumber=theRequest.orderNumber;
				 orderStyle=theRequest.orderStyle;		 
		}
		console.log(orderNumber);
    	var jcData=encodeURIComponent(JSON.stringify({"order_no":orderNumber}));
    	if(orderStyle==2){   
			$('.jinCai').removeClass('hidden');
			jczq();
		}else if(orderStyle==1){
			$('.daLeTou').removeClass('hidden');
			dlt();
		}
    	function  dlt(){
    		$.ajax({
		            method: "POST",
		            data:'param_str='+jcData,
		            url:BACKEND_URL+'/api/order/detail',
					datatype: "json",
					contentType:"application/x-www-form-urlencoded; charset=UTF-8",
		            success: function(re) { 
		            	console.log(re);
		            	 if(re.data.win_status==0){
		            	 	re.data.win_status="未开奖";
		            	 }else if(re.data.win_status==1){
		            	 	re.data.win_status="中奖";
		            	 }else if(re.data.win_status==2){
		            	 	re.data.win_status="未中奖";
		            	 }
		            	var htmlHeader=`
		            	<div class="row">
		                    <div class="col-sm-3 col-xs-3">订单编号:</div>
		                    <div class="col-sm-8 col-xs-8">${re.data.order_no}</div>
		                </div>             
		                <div class="row">
		                    <div class="col-sm-3 col-xs-3">总金额:</div>
		                    <div class="col-sm-8 col-xs-8">${re.data.points/10}元</div>
		                </div>
		                <div class="row">
		                    <div class="col-sm-3 col-xs-3">方案状态:</div>
		                    <div class="col-sm-8 col-xs-8">${re.data.win_status}</div>
		                </div>
		                              
		                <div class="row">
		                    <div class="col-sm-3 col-xs-3">开奖号码</div>
		                    <div class="col-sm-8 col-xs-8">${re.data.bonuscode}</div>
		                </div>	
		                <div class="row">
			                <div class="col-sm-3 col-xs-3">起始次数:</div>
			                <div class="col-sm-8 col-xs-8">第${re.data.issue}期</div>
			            </div> 
		            	`;		            	
		            	$('.header-container').html(htmlHeader);
		            	var htmlsection;
		            	for(var i=0;i<re.data.bet_codes.length;i++){		            		
		            		htmlsection +=`
		            			<tr>
	                                <td>${re.data.bet_codes[i].num}</td>	                                    	                               
	                                <td class="position-relative lottory-detailrecord-list">
	                                    ${re.data.bet_codes[i].code}
	                                    <span class="ballcon-js-n icon-dropdown-trans"></span>
	                                </td>	       
	                                <td>${re.data.bet_codes[i].play_method}</td>	                                   	                                	        
	                                <td class="border-right-none">${re.data.multiple}</td>	                                    	                                
	                            </tr>
		            		`;
		            	}
       	 			    $('.tbody-container').html(htmlsection);  	  
				    },
		            error: function(re) {
		                console.log(re);
		            }
		           
		    	})	
    	}
    	
    	
    	 function jczq(){
    			$.ajax({
		            method: "POST",
		            data:'param_str='+jcData,
		            url:BACKEND_URL+'/api/order/detail',
					datatype: "json",
					contentType:"application/x-www-form-urlencoded; charset=UTF-8",
		            success: function(re) { 	
		            	console.log(re);
		            	if(re.data.win_status==0){
		            	 	re.data.win_status="未开奖";
		            	 }else if(re.data.win_status==1){
		            	 	re.data.win_status="中奖";
		            	 }else if(re.data.win_status==2){
		            	 	re.data.win_status="未中奖";
		            	 }
		            	 var htmlHeader="";
		            	 	htmlHeader=`
	            	 		<div class="row">
				                <div class="col-sm-3 col-xs-3">订单编号:</div>
				                <div class="col-sm-8 col-xs-8">${re.data.order_no}</div>
				            </div>			          			
				            <div class="row">
				                <div class="col-sm-3 col-xs-3">总金额:</div>
				                <div class="col-sm-8 col-xs-8">${re.data.points/10}元</div>
				            </div>
				            <div class="row">
				                <div class="col-sm-3 col-xs-3">订单状态:</div>
				                <div class="col-sm-8 col-xs-8">${re.data.win_status}</div>
				            </div>
				            <div class="row">
				                <div class="col-sm-3 col-xs-3">进度:</div>
				                <div class="col-sm-8 col-xs-8">10/10</div>
				            </div>
				            <div class="row">
				                <div class="col-sm-3 col-xs-3">起始次数:</div>
				                <div class="col-sm-8 col-xs-8">第${re.data.issue}期</div>
				            </div> 
		            	 	`;
		            	 	$('.header-container').html(htmlHeader);
		            	 var htmlsection=""	            		            		            	
				       	 for(var i=0;i<re.data.bet_codes.length;i++){				       	 	
							if(re.data.bet_codes[i].result==3){
								re.data.bet_codes[i].result="主胜";
							}else if(re.data.bet_codes[i].result==1){
								re.data.bet_codes[i].result="主平";
							}else if(re.data.bet_codes[i].result==0){
								re.data.bet_codes[i].result="主负";
							}else {
                                re.data.bet_codes[i].result="未开奖";
                            }
							console.log(re.data.bet_codes[i].bet_odds[0]);
							
							if(re.data.bet_codes[i].bet_odds[0]!=""){
								re.data.bet_codes[i].bet_odds[0]="主负"+re.data.bet_codes[i].bet_odds[0];							
							} 
							if(re.data.bet_codes[i].bet_odds[1]!=""){							
								re.data.bet_codes[i].bet_odds[1]="主平"+re.data.bet_codes[i].bet_odds[1];
							} 
							if(re.data.bet_codes[i].bet_odds[2]!=""){							
								re.data.bet_codes[i].bet_odds[2]="主胜"+re.data.bet_codes[i].bet_odds[2];
							}
				       	 	htmlsection +=`
				       	 		<tr>
	                            <td><span>${re.data.bet_codes[i].week}</span><span>${re.data.bet_codes[i].period}</span> </td>                                                         
	                            <td class="position-relative lottory-detailrecord-list">
	                                <span>${re.data.bet_codes[i].hometeam}</span>
	                                <span>${re.data.bet_codes[i].result_code}</span>                              
	                                <span>${re.data.bet_codes[i].guestteam}</span>
	                            </td>    
	                            <td class="winData">
	                             <span >${re.data.bet_codes[i].bet_odds[2]}</span>
	                             <span >${re.data.bet_codes[i].bet_odds[1]}</span>                              
	                             <span >${re.data.bet_codes[i].bet_odds[0]}</span>                            
	                            </td>
	                            <td class="border-right-none">${re.data.bet_codes[i].result}</td>			                                    			                               
	                        </tr>      
				       	 	`;
				       	}
				       	 
				       	 $('.tbody-container').html(htmlsection);	
				       	 var len=$('.winData').length;			       	 
				       	for(var i=0;i<len;i++){			       	 	
				       	 	var childOne=$(".winData:eq("+i+")").children().eq(0).text().substring(2,0);
				       	 	var childTwo=$(".winData:eq("+i+")").children().eq(1).text().substring(2,0);
				       	 	var childThree=$(".winData:eq("+i+")").children().eq(2).text().substring(2,0);
				       	 	var winResult=$(".border-right-none:eq("+i+")").text();			       	 				       	 	
							for(var j=0;j<1;j++){								
							if(childOne==winResult){				       	 		
				       	 		$(".winData:eq("+i+")").children().eq(0).addClass('active');
				       	 		$(".border-right-none:eq("+i+")").addClass('active');
					       	}else if(childTwo==winResult){	
					       	   	$(".border-right-none:eq("+i+")").addClass('active');
					       	 	$(".winData:eq("+i+")").children().eq(1).addClass('active');			       	 	
					       	}else if(childThree==winResult){
					       	 	$(".border-right-none:eq("+i+")").addClass('active');
					       	 	$(".winData:eq("+i+")").children().eq(2).addClass('active');			       	 	
					       	}
						}
				       	 	
				    }			       	 			       	 			       	  
				    },
		            error: function(re) {
		                console.log(re);
		            }
		           
		    	})	
    		}
			
	    	
    </script>
</body>
</html>